<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>vue</title>
    <link rel="stylesheet" href="animate.css">
</head>
<script src="vue.js"></script>


<body>
    <!--css过渡动画-->
    <!--<h1 class="animated infinite bounce">Example</h1>-->
    <div id="app">
        <button @click="type=!type">切换</button>
        <transition  enter-active-class="animated zoomInDown" leave-active-class="animate zoomInDown" name="hd">
            <h1 v-if="type">后段军</h1>
        </transition>
    </div>


<script>


    var app=new Vue({
        el:'#app',
        data:{
            type:true,
        }
    });

</script>

</body>
</html>